<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>宇成建筑</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link rel="stylesheet" href="../statics/css/font.css">
    <link rel="stylesheet" href="../statics/plugins/layui/css/layui.css">
    <link rel="stylesheet" href="../statics/css/xadmin.css">
    <link rel="stylesheet" href="../statics/css/style.css">
    <style>
        .layui-table td, .layui-table th {
            min-width: 50px;
        }

        .layui-table-tips-c:before {
            position: relative;
            right: 0px;
            top: -3px;
        }

        .label{
            font-size: 14px;
        }
        .label p {
            display: inline-block;
            line-height: 30px;
            margin-left: 20px;
        }
    </style>
</head>

<body class='labelAuto workmanAssignmentLog'>
<div class="x-nav">
        <span class="layui-breadcrumb">
            <a href="welcome.html">首页</a>
            <a href="javascript:;">施工管理</a>
            <a href="javascript:;" class="projectName"></a>
            <a class="areaName" href="javascript:;"></a>
            <a class="sectionName" href="javascript:;"></a>
            <a>
                <cite>施工分账记录</cite>
            </a>
        </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       onclick="location.reload()" title="刷新">
        <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i>
    </a>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right;margin-right:10px"
       onclick="window.history.go(-1)" title="后退">
        <i class="iconfontBlod" style="line-height:30px">&#xe74f;</i>
    </a>
</div>
<div class="layui-fluid">
    <div class="layui-row layui-col-space15" style="background-color: #fff">
        <div class="layui-col-md12">
            <div class="layui-tab layui-tab-card" lay-filter="profession-tab">
                <ul class="layui-tab-title">
                    <li class="layui-this">加载中...</li>
                </ul>
                <div class="layui-tab-content profession-tab-content">
                    <div class="layui-tab-item layui-show">加载中...</div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script src="../statics/plugins/layui/layui.js" charset="utf-8"></script>
<script src='../statics/plugins/jQuery-3.2.1/jquery-3.2.1.min.js'></script>
<script type="text/javascript" src="../statics/plugins/X-admin/xadmin.js"></script>
<script type="text/javascript" src="../statics/js/public.js?v=1129"></script>
<script type="text/javascript">
    layui.use(['form', 'layer', "table", "laydate", 'element'], function () {
        var element = layui.element;
        var table = layui.table;
        var form = layui.form;
        var layer = layui.layer;

        var projectId = getQueryString('projectId');
        var areaId = getQueryString('areaId');
        var sectionId = getQueryString('sectionId');
        var professionId = '';
        var groupId = '';

        var areaName = localStorage.getItem('areaName');
        var sectionName = localStorage.getItem('sectionName');
        $('.layui-breadcrumb a.projectName').html(localStorage.getItem('projectName'));
        $('.layui-breadcrumb a.areaName').html(areaName);
        $('.layui-breadcrumb a.sectionName').html(sectionName);
        $('.projectName').on('click',function(){window.location.href='ConstructionLedgerRecord.html'});
        $('.areaName').on('click',function(){window.location.href=`ConstructionLedgerRecord1.html?projectId=${projectId}`});
        $('.sectionName').on('click',function(){window.location.href=`constructionLedger.html?projectId=${projectId}&areaId=${areaId}`});
        $.ajax({
            url: url + "/setting/profession/selectLists",
            type: "POST",
            async: false,
            data: {
                token: getToken()
            },
            success: function (r) {
                if (r.code == 100000) {
                    var li = '';
                    var item = '';
                    for (var i = 0; i < r.data.length; i++) {
                        if (i == 0) {
                            li += `
                            <li class="layui-this" data-id=${r.data[i].id} lay-id="${i}">
                                <a href="javascript:;" title="${r.data[i].name}">${r.data[i].name}</a>
                            </li>`
                            item += `<div class="layui-tab-item layui-show item-empty">加载中...</div>`
                        } else {
                            li += `
                            <li data-id=${r.data[i].id}>
                                <a href="javascript:;" title="${r.data[i].name}">${r.data[i].name}</a>
                            </li>`
                            item += `<div class="layui-tab-item item-empty">加载中...</div>`
                        }
                    }
                    $('ul.layui-tab-title').empty().html(li);
                    $('.layui-tab-content').empty().html(item)
                    element.render()
                } else {
                    tips('工种', r);
                }
            }
        });
        professionId = $('div[lay-filter=profession-tab] li.layui-this').data('id');
        tabProfessionData($('div[lay-filter=profession-tab] li.layui-this').data('id'));
        //切换工种
        element.on('tab(profession-tab)', function (data) {
            professionId = $(this).data('id')
            tabProfessionData(professionId);
        });

        function tabProfessionData(professionId) {
            let data = ''
            $.ajax({
                url: url + "/project/project/group",
                type: "POST",
                async: false,
                data: {
                    projectId: projectId,
                    sectionId: sectionId,
                    professionId: Number(professionId),
                    token: getToken()
                },
                success: function (r) {
                    data = r.data
                }
            })
            if (data.length == 0) {
                $('div.profession-tab-content .layui-show').empty().html('未查询到数据...');
                return false
            }
            //构建layui标签结构
            if ($('div.profession-tab-content .layui-show').hasClass('item-empty')) {
                $('div.profession-tab-content .layui-show').empty().html(`
                    <div class="layui-tab layui-tab-card" lay-filter="group-tab">
                        <ul class="layui-tab-title">

                        </ul>
                        <div class="layui-tab-content group-tab-content">

                        </div>
                    </div>
                `);
                $('div.profession-tab-content .layui-show').removeClass('item-empty')
            }
            let li = '';
            let item = '';
            for (let i = 0; i < data.length; i++) {
                let show = '';
                if (i == 0) {
                    show = 'layui-show';
                }
                if (i == 0) {
                    li += `
                            <li class="layui-this" data-id=${data[i].id} lay-id="${i}">
                                <a href="javascript:;" title="${data[i].name}">${data[i].name}</a>
                            </li>`
                    item += `<div class="layui-tab-item ${show} item-empty">加载中...</div>`
                } else {
                    li += `
                            <li data-id=${data[i].id} lay-id="${i}">
                                <a href="javascript:;" title="${data[i].name}">${data[i].name}</a>
                            </li>`
                    item += `<div class="layui-tab-item item-empty">加载中...</div>`
                }
            }
            $('div[lay-filter=group-tab] ul.layui-tab-title').empty().html(li);
            $('.group-tab-content').empty().html(item)
            element.render();
            groupId = $('div[lay-filter=group-tab] li.layui-this').data('id');
            tabGroupData($('div[lay-filter=group-tab] li.layui-this').data('id'));
        }

        //切换班组
        element.on('tab(group-tab)', function (data) {
            groupId = $(this).data('id');
            tabGroupData(groupId);
        });

        element.on('tab(assignment-tab)', function (data) {
            let d1 = $(this).data('id');
            tableAssignment(d1);
        });

        element.on('tab(account-tab)', function (data) {
            let d1 = $(this).data('id');
            tableAccounts(d1);
        });

        function tabGroupData(groupId) {
            let batch = 0;
            $.ajax({
                url: url + "/project/project/getBatch",
                type: "POST",
                async: false,
                data: {
                    projectId: projectId,
                    sectionId: sectionId,
                    professionId: Number(professionId),
                    groupId: Number(groupId),
                    token: getToken()
                },
                success: function (r) {
                    batch = r.data
                }
            })
            //构建layui标签结构
            if ($('div.group-tab-content> .layui-show').hasClass('item-empty')) {
                $('div.group-tab-content> .layui-show').empty().html(`
                    <div class="layui-row">
                        <div class="layui-col-md4"></div>
                        <div class="layui-col-md4" style="text-align: center"><h2>班组-楼层施工量价清单</h2></div>
                        <div class="layui-col-md4" style="text-align: right"></div>
                    </div>
                    <div class="layui-tab layui-tab-card" lay-filter="assignment-tab">
                        <ul class="layui-tab-title">
                            <li class="layui-this" lay-id="0">
                                <a href="javascript:;" title="总览">总览</a>
                            </li>
                        </ul>
                        <div class="layui-tab-content assignment-tab-content">
                            <div class="layui-tab-item layui-show item-empty">加载中...</div>
                        </div>
                    </div>
                    <br><hr><br>
                    <div class="layui-row">
                        <div class="layui-col-md4"></div>
                        <div class="layui-col-md4" style="text-align: center"><h2>班组人员-入账明细单</h2></div>
                        <div class="layui-col-md4"></div>
                    </div>
                    <div class="layui-tab layui-tab-card" lay-filter="account-tab">
                        <ul class="layui-tab-title">
                            <li class="layui-this" lay-id="0">
                                <a href="javascript:;" title="总览">总览</a>
                            </li>
                        </ul>
                        <div class="layui-tab-content account-tab-content">
                            <div class="layui-tab-item layui-show item-empty">加载中...</div>
                        </div>
                    </div>
                `);
                $('div.group-tab-content> .layui-show').removeClass('item-empty')
            }

            let li_assignment = '';
            let item_assignment = '';
            let li_this = '';
            let show = '';
            for (let i = 0; i <= batch.length; i++) {
                if (i === 0) {
                    title = '总览';
                    tableFilter = `${groupId}_assignment_all`;
                    li_this = 'layui-this';
                    show = 'layui-show';
                    li_assignment += `
                       <li class="${li_this}" data-id="all" lay-id="all">
                           <a href="javascript:;" title="${title}">${title}</a>
                       </li>`
                } else {
                    title = (batch[i-1]) === 0?'未保存':`批次${batch[i-1]}`;
                    tableFilter = `${groupId}_assignment_batch_${batch[i-1]}`;
                    li_this = show = '';
                    li_assignment += `
                       <li class="${li_this}" data-id="${batch[i-1]}" lay-id="${batch[i-1]}">
                           <a href="javascript:;" title="${title}">${title}</a>
                       </li>`
                }

                item_assignment += `<div class="layui-tab-item ${show}">
                       <table class="layui-table" id="${tableFilter}" lay-filter="${tableFilter}"></table>
                   </div>`
            }
            $('div.profession-tab-content>.layui-show div.group-tab-content>.layui-show').find('div[lay-filter=assignment-tab] ul.layui-tab-title').empty().html(li_assignment);
            $('div.profession-tab-content>.layui-show div.group-tab-content>.layui-show').find('div[lay-filter=assignment-tab] .layui-tab-content').empty().html(item_assignment);
            tableAssignment('all');

            let li_account = '';
            let item_account = '';
            let li_this1 = '';
            let show1 = '';
            for (let i = 0; i <= batch.length; i++) {
                if (i === 0) {
                    title = '总览';
                    tableFilter = `${groupId}_accounts_all`;
                    li_this1 = 'layui-this';
                    show1 = 'layui-show';
                    li_account += `
                       <li class="${li_this1}" data-id="${batch[i-1]}" lay-id="${batch[i-1]}">
                           <a href="javascript:;" title="${title}">${title}</a>
                       </li>`
                    item_account += `<div class="layui-tab-item ${show1}">
                       <table class="layui-table" id="${tableFilter}" lay-filter="${tableFilter}"></table>
                   </div>`
                }else {
                    if (i>1){
                        title = `批次${batch[i-1]}`;
                        tableFilter = `${groupId}_accounts_batch_${batch[i-1]}`;
                        li_this1 = show1 = '';
                        li_account += `
                       <li class="${li_this1}" data-id="${batch[i-1]}" lay-id="${batch[i-1]}">
                           <a href="javascript:;" title="${title}">${title}</a>
                       </li>`
                        item_account += `<div class="layui-tab-item ${show1}">
                       <table class="layui-table" id="${tableFilter}" lay-filter="${tableFilter}"></table>
                   </div>`
                    }
                }

            }
            $('div.profession-tab-content>.layui-show div.group-tab-content>.layui-show').find('div[lay-filter=account-tab] ul.layui-tab-title').empty().html(li_account);
            $('div.profession-tab-content>.layui-show div.group-tab-content>.layui-show').find('div[lay-filter=account-tab] .layui-tab-content').empty().html(item_account);
            tableAccounts(0);

            // element.render();
        }

        function tableAssignment(i) {
            if (i === 'all') {
                tableFilter = `${groupId}_assignment_all`;
                batch = '';
            } else {
                tableFilter = `${groupId}_assignment_batch_${i}`;
                batch = i;
            }
            table.render({
                elem: `#${tableFilter}`, //绑定DOM元素
                id: tableFilter, //table的id
                title: '施工量价记录',
                height: 'full-130',
                contentType: "application/json; charset=utf-8",
                url: url + '/project/project/groupAssignment', //数据接口地址
                request: {
                    pageName: 'page', //页码的参数名称，默认：page
                    limitName: 'length' //每页数据量的参数名，默认：limit
                },
                method: 'POST',
                parseData: function (res) {
                    return {
                        "code": res.code, //解析接口状态
                        "data": res.data,
                        "msg": res.msg,
                        "count": res.data.count
                    };
                },
                where: {
                    projectId: projectId,
                    sectionId: sectionId,
                    professionId: Number(professionId),
                    groupId: Number(groupId),
                    batch: batch,
                    token: getToken()
                },
                toolbar: '#toolbar',
                defaultToolbar: ['filter',{title: '导出', layEvent: 'excel', icon: 'layui-icon-export'}],
                page: false, //开启分页
                limit: 10, //默认每页记录条数
                limits: [10, 20, 50], //每页记录条数可选数量
                totalRow:true,
                cols: [
                    [ //表头
                        {field: '', title: '编号', type: 'numbers', width: '50',totalRowText:'合计'},
                        {field: 'assignmentName', title: '施工项', width: '180'},
                        {field: 'labelName', title: '标签', width: '90'},
                        {
                            field: 'amount', title: '工程量', width: '100', templet(d) {
                                return numberFormat(d.amount);
                            }
                        },
                        {field: 'unitName', title: '单位', width: '100'},
                        {
                            field: 'price', title: '单价', width: "90", templet(d) {
                                return numberFormat(d.price, 'currency');
                            }
                        },
                        {
                            field: 'totalPrice', title: '总价', width: "100",totalRow:true, templet(d) {
                                return numberFormat(d.totalPrice, 'currency');
                            }
                        },
                        {
                            field: 'remark', title: '备注', width: "300", templet(d) {
                                return d.remark === 'null' ? '' : d.remark;
                            }
                        },
                        {
                            field: 'completeTime', title: '记录时间', width: "100", templet(d) {
                                return d.completeTime.substr(0, 10);
                            }
                        },
                        {field: 'adminName', title: '录入人', width: "80"},
                        {
                            field: 'batch', title: '批次', width: "80", templet(d) {
                                return d.batch===0?'未保存':d.batch;
                            }
                        },
                        {
                            field: 'status', title: '审批状态', width: "80", templet(d) {
                                return approvalStatus(d.status);
                            }
                        },
                    ]
                ],
                response: {
                    statusName: 'code', //数据状态的字段名称，默认：code
                    statusCode: 100000, //成功的状态码，默认：0
                    msgName: 'msg', //状态信息的字段名称，默认：msg
                    countName: 'count', //数据总数的字段名称，默认：count
                    dataName: 'data' //数据列表的字段名称，默认：data
                },
                done: function (res, curr, count) {
                    let labelHtml = labelStatistics(res.data);
                    $('div.profession-tab-content>.layui-show div.group-tab-content> .layui-show div.assignment-tab-content> .layui-show').append(labelHtml);
                    permission();
                }
            });
            table.on(`toolbar(${tableFilter})`, function (data) {
                let tableId = data.config.id
                let batch = '';
                if (tableId.indexOf('batch') > -1) {
                    batch = tableId.substr(tableId.indexOf('batch') + 6);
                }
                if (data.event === 'excel') {//施工量价导出
                    $.ajax({
                        url: url + '/excel/export/workmanAssignment',
                        type: 'post',
                        data: {
                            projectId: projectId,
                            sectionId: sectionId,
                            professionId: professionId,
                            groupId: groupId,
                            batch: batch,
                            token: getToken()
                        },
                        success: function (r) {
                            if (r.code == 100000) {
                                tips('导出', r);
                            } else {
                                tips('导出', r);
                            }
                        }
                    })
                }
            });
        }

        function tableAccounts(i) {
            if (i === 0) {
                tableFilter = `${groupId}_accounts_all`;
                cols =[
                    [ //表头
                        {field: '', title: '编号', type: 'numbers', width: '80', fixed: 'left',totalRowText:'合计'},
                        {field: 'employeeName', title: '姓名', width: '210'},
                        {field: 'jobNumber', title: '工号', width: '120'},
                        {field: 'account', title: '分账金额', width: '150',totalRow:true, templet(d) {return numberFormat(d.account,'currency');}}
                    ]
                ];
                batch = '';
            } else {
                tableFilter = `${groupId}_accounts_batch_${i}`;
                batch = i
                cols = [
                    [ //表头
                        {field: '', title: '编号', type: 'numbers', width: '50', fixed: 'left',totalRowText:'合计'},
                        {field: 'employeeName', title: '姓名', width: '180'},
                        {field: 'jobNumber', title: '工号', width: '90'},
                        {
                            field: 'account', title: '分账金额', width: '100',totalRow:true, templet(d) {
                                return numberFormat(d.account,'currency');
                            }
                        },
                        {field: 'separateTime', title: '分账时间', width: '100', templet(d) {
                                return d.separateTime.substr(0, 10);
                            }},
                        {
                            field: 'remark', title: '备注', width: "300", templet(d) {
                                return d.remark === null ? '' : d.remark;
                            }
                        },
                        {
                            field: 'createTime', title: '记录时间', width: "100", templet(d) {
                                return d.createTime.substr(0, 10);
                            }
                        },
                        {field: 'adminName', title: '录入人', width: "80"},
                        {
                            field: 'batch', title: '批次', width: "80", templet(d) {
                                return d.batch===0?'未保存':d.batch;
                            }
                        },
                        {
                            field: 'status', title: '审批状态', width: "80", templet(d) {
                                return approvalStatus(d.status);
                            }
                        },
                    ]
                ];
            }

            table.render({
                elem: `#${tableFilter}`, //绑定DOM元素
                id: tableFilter, //table的id
                title: '入账明细单',
                height: 'full-130',
                contentType: "application/json; charset=utf-8",
                url: url + '/project/project/groupAccounts', //数据接口地址
                request: {
                    pageName: 'page', //页码的参数名称，默认：page
                    limitName: 'length' //每页数据量的参数名，默认：limit
                },
                method: 'POST',
                parseData: function (res) {
                    return {
                        "code": res.code, //解析接口状态
                        "data": res.data,
                        "msg": res.msg,
                        "count": res.count
                    };
                },
                where: {
                    projectId: projectId,
                    sectionId: sectionId,
                    professionId: Number(professionId),
                    groupId: Number(groupId),
                    batch: batch,
                    token: getToken()
                },
                toolbar: '#toolbar',
                defaultToolbar: ['filter',{title: '导出', layEvent: 'excel', icon: 'layui-icon-export'}],
                page: false, //开启分页
                limit: 10, //默认每页记录条数
                limits: [10, 20, 50], //每页记录条数可选数量
                totalRow:true,
                cols: cols,
                response: {
                    statusName: 'code', //数据状态的字段名称，默认：code
                    statusCode: 100000, //成功的状态码，默认：0
                    msgName: 'msg', //状态信息的字段名称，默认：msg
                    countName: 'count', //数据总数的字段名称，默认：count
                    dataName: 'data' //数据列表的字段名称，默认：data
                },
                done: function () {
                    permission();
                }
            });

            table.on(`toolbar(${tableFilter})`, function (data) {
                let tableId = data.config.id
                let batch = '';
                if (tableId.indexOf('batch') > -1) {
                    batch = tableId.substr(tableId.indexOf('batch') + 6);
                }
                if (data.event === 'excel') {//班组人员分账导出
                    $.ajax({
                        url: url + '/excel/export/workmanAccounts',
                        type: 'post',
                        data: {
                            projectId: projectId,
                            sectionId: sectionId,
                            professionId: professionId,
                            groupId: groupId,
                            batch: batch,
                            token: getToken()
                        },
                        success: function (r) {
                            if (r.code == 100000) {
                                tips('导出', r);
                            } else {
                                tips('导出', r);
                            }
                        }
                    })
                }
            });
        }

        function labelStatistics(data) {
            let html = '<div class="label">施工项分类合计：';
            let labelId = [];
            let labelList = [];
            $.each(data, function (i, e) {
                if (data[i].labelId != null) {
                    if (labelId.indexOf(data[i].labelId) === -1) {
                        labelId.push(data[i].labelId);
                        labelList.push({
                            labelId: data[i].labelId,
                            labelName: data[i].labelName,
                            account: Number(data[i].totalPrice)
                        });
                    } else {
                        let index = labelId.indexOf(data[i].labelId)
                        labelList[index].account += Number(data[i].totalPrice);
                    }
                }
            });
            $.each(labelList, function (i, e) {
                html += `<p>${labelList[i].labelName}：${numberFormat(labelList[i].account, 'currency')}</p>`;
            });
            return html;
        }
    })
</script>

</html>